<div class="login-warp lgpopwrap b-radius" id="lgpopwrap">
  <form action="" method="post" class="loginFrm" id="login_form">
    <table>
      <tr>
        <td colspan="2"><div class="lgr valid-d f-cb">
            <h3>用户登录</h3>
            <a href="index.php?app=member&act=register" target="_blank">免费注册</a>
            <p class="returntips" id="returntips"></p>
            <a href="javascript:void(0)" class="lgpopclose" onclick="wl.hiddenLogin()">X</a>
          </div></td>
      </tr>
      <tr>
        <td align="right">账户名：</td>
        <td><div class="valid-d">
            <input type="text" name="user_name" value="{$user_name}" id="user_name" class="text b-radius" placeholder="用户名/邮箱/手机" />
            <label for="user_name" id="username_l" class="tips"></label>
          </div></td>
      </tr>
      <tr>
        <td align="right">密码：</td>
        <td><div class="valid-d">
            <input type="password" name="password" id="password" class="text b-radius" onfocus="seffect(this)" onblur="heffect(this)" />
            <label for="password" id="password_l" class="tips"></label>
          </div></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td class="f-cb"><div class="f-fl">
            <input type="checkbox" name="remember_account" id="remember_account" value="1" />
            <span>记住账号</span> </div>
          <a href="index.php?app=find_password" target="_blank">忘记密码？</a></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td><input type="submit" name="submit" id="submit" value="登录" class="btn b-radius" />
          <input type="hidden" name="ret_url" value="{$ret_url}" /></td>
      </tr>
    </table>
  </form>
</div>
<script type="text/javascript">
! function($) {
    function support() {
      return 'placeholder' in document.createElement('input');
    }
    $.fn.lrRerify = function() {
      var form = this;
      var elements = form.find("input[placeholder]");
      if (!support()) {
        elements.each(function() {
          var v = $(this).val();
          var pv = $(this).attr('placeholder');
          var wrap = $(this).siblings('label');
          wrap.html(pv);
          if (v) {
            wrap.hide();
          }
          $(this).bind('focus', function() {
            $(this).addClass('hover');
            wrap.hide();
          });
          $(this).bind('blur', function() {
            var v2 = $(this).val();
            $(this).removeClass('hover');
            if (!v2) {
              wrap.show();
            }
          });
        });
      } else {
        elements.each(function() {
          $(this).bind('focus', function() {
            $(this).addClass('hover');
          });
          $(this).bind('blur', function() {
            $(this).removeClass('hover');
          });
        });
      }
    };
  }(jQuery);

  function seffect(o) {
    $(o).addClass('hover');
  }

  function heffect(o) {
    $(o).removeClass('hover');
  }
  $(function() {
    // wl.showLogin();
    $('#login_form').validate({
      errorPlacement: function(error, element) {
        element.parent().append(error);
      },
      onkeyup: false,
      debug: true,
      submitHandler: function(form) {
        var user_name = $('#user_name').val(),
          password = $('#password').val(),
          remember_account = $('#remember_account').val(),
          returntips = $('#returntips'),
          ret_url = $('#ret_url').val();
        $.ajax({
          type: "get",
          url: USER_SITE_URL+"/index.php?app=member&act=Ajaxlogin&jsoncallback=?",
          data: {
            'user_name': user_name,
            'password': password,
            'remember_account': remember_account
          },
          dataType: "jsonp",
          success: function(jdata) {
            if (jdata.done) {
              window.location.reload();
            } else {
              returntips.empty().html(jdata.msg).fadeIn();

              function returnFn() {
                returntips.fadeOut(800);
              }
              setTimeout(returnFn, 5000);
            }
          }
        });
      },
      rules: {
        user_name: {
          required: true,
          isCheckAccount: true
        },
        password: {
          required: true,
          checkPassword: true
        },
        captcha: {
          required: true,
          remote: {
            url: 'index.php?app=captcha&act=check_captcha',
            type: 'get',
            data: {
              captcha: function() {
                return $('#captcha1').val();
              }
            }
          }
        }
      },
      messages: {
        user_name: {
          required: '账户名不能为空',
          isCheckAccount: '账户名不正确'
        },
        password: {
          required: '密码不能为空',
          checkPassword: '密码不能为纯数字或包含非法字符'
        },
        captcha: {
          required: '验证码不能为空',
          remote: '验证码错误'
        }
      }
    });
    $('#login_form').lrRerify();
  });
</script>